$(document).ready(function () {
    予清空()
    观dom()
});

function 予清空() {
    $('input[type="text"], input[type="number"], input[type="password"]').each(function () {
        var $input = $(this);
        if ($input.data("clearable-added")) return;
        
        $input.data("clearable-added", true);
        if ($input.css("position") === "static") $input.css("position", "relative");

        // 创建带Octicons图标的清空按钮
        var $clearButton = $('<button type="button" class="clear-input-btn btn btn-xs octicon-btn">')
            .attr("title", "清空")
            .html('<i class="octicon octicon-stop"></i>') // Octicons停止图标
            .css({
                position: "absolute",
                right: "8px",
                top: "50%",
                transform: "translateY(-50%)",
                display: "none",
                zIndex: 100,
                padding: "0",
                width: "20px",
                height: "20px",
                lineHeight: "20px",
                textAlign: "center",
                cursor: "pointer",
                background: "transparent", // 透明背景
                border: "1px solid #e0e0e0", // 细边框
                borderRadius: "3px", // 小圆角
                color: "#666", // 深灰色图标
                transition: "all 0.2s ease" // 过渡动画
            })
            .insertAfter($input);

        // 焦点事件
        $input.on("focus", function () {
            if ($input.val()) $clearButton.show();
        });

        // 失焦事件（延迟隐藏）
        $input.on("blur", function () {
            setTimeout(() => {
                if (!$clearButton.is(":hover")) $clearButton.hide();
            }, 100);
        });

        // 悬停效果
        $clearButton.on("mouseenter", function () {
            $(this).css({
                background: "#f5f5f5", // 浅灰背景
                borderColor: "#d0d0d0", // 深边框
                color: "#333" // 深灰图标
            });
        });

        // 离开效果
        $clearButton.on("mouseleave", function () {
            $(this).css({
                background: "transparent",
                borderColor: "#e0e0e0",
                color: "#666"
            });
        });

        // 值变化时显示/隐藏按钮
        $input.on("input", function () {
            $input.val() ? $clearButton.show() : $clearButton.hide();
        });

        // 点击清空
        $clearButton.on("click", function (e) {
            e.stopPropagation();
            $input.val("").trigger("change");
            $clearButton.hide();
        });
    });
}

function 观dom() {
    // 动态DOM监听逻辑不变
    var observer = new MutationObserver(mutations => {
        mutations.forEach(mutation => {
            if (mutation.addedNodes.length) {
                $(mutation.addedNodes).find('input[type="text"], input[type="number"], input[type="password"]').each(() => 予清空());
            }
        });
    });
    observer.observe(document.body, { childList: true, subtree: true });
}